﻿@page "/admin/settings/notification"
@inject IConfiguration Configuration
@section scripts {
    <script type="module">
        import * as settings from '/js/app/admin.settings.module.js';

        window.sendTestEmail = function () {
            document.querySelector('#a-send-test-mail').classList.add('disabled');
            document.querySelector('#a-send-test-mail').setAttribute('disabled', 'disabled');

            callApi('/api/settings/email/test',
                'POST',
                {},
                async function (success) {
                    blogToast.success('Email is sent.');
                },
                function (always) {
                    document.querySelector('#a-send-test-mail').classList.remove('disabled');
                    document.querySelector('#a-send-test-mail').removeAttribute('disabled');
                });
        };

        const form = document.querySelector('#form-settings');
        form.addEventListener('submit', settings.handleSettingsSubmit);
    </script>
}
@{
    var settings = BlogConfig.NotificationSettings;
}

@section admintoolbar {
    <partial name="_SettingsHeader" />
}

<form id="form-settings" asp-controller="Settings" asp-action="Notification">
    <div class="admin-settings-entry-container">
        <div class="row">
            <div class="col-md-6">
                <div>
                    <h4 class="admin-subtitle fw-bold mb-2">@SharedLocalizer["Email Options"]</h4>

                    @if (string.IsNullOrWhiteSpace(Configuration["Email:ApiEndpoint"]) ||
                    string.IsNullOrWhiteSpace(Configuration["Email:ApiKey"]))
                    {
                        <div class="alert alert-warning">
                            Please follow <a href="https://github.com/EdiWang/Moonglade/blob/master/README.md#email-notification" target="_blank">instructions</a> to setup email API.
                        </div>
                    }
                    else
                    {
                        <div class="settings-entry2 row align-items-center py-3 px-2 rounded-3 shadow-sm border bg-white mb-2">
                            <div class="col-auto">
                                <i class="bi-link settings-entry-icon"></i>
                            </div>
                            <div class="col">
                                <label>API Endpoint</label>
                            </div>
                            <div class="col-6">
                                <input readonly="readonly" class="form-control" spellcheck="false" value="@Configuration["Email:ApiEndpoint"]" />
                            </div>
                        </div>
                    }

                    <div class="settings-entry2 row align-items-center py-3 px-2 rounded-3 shadow-sm border bg-white mb-2">
                        <div class="col-auto">
                            <i class="bi-pen settings-entry-icon"></i>
                        </div>
                        <div class="col">
                            <label asp-for="@settings.EmailDisplayName"></label>
                        </div>
                        <div class="col-6">
                            <input asp-for="@settings.EmailDisplayName" class="form-control" required maxlength="64" />
                        </div>
                    </div>

                    <div class="settings-entry2 row align-items-center py-3 px-2 rounded-3 shadow-sm border bg-white mb-2">
                        <div class="col-auto">
                            <i class="bi-envelope settings-entry-icon"></i>
                        </div>
                        <div class="col">
                            @SharedLocalizer["Send Test Email"]
                        </div>
                        <div class="col-md-5 text-end">
                            <a href="javascript:sendTestEmail();" id="a-send-test-mail" class="btn btn-sm btn-outline-accent">
                                Send
                            </a>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-md-6">
                <div>
                    <h4 class="admin-subtitle fw-bold mb-2">@SharedLocalizer["Notification Options"]</h4>

                    <div class="settings-entry2 row align-items-center py-3 px-2 rounded-3 shadow-sm border bg-white mb-2">
                        <div class="col-auto">
                            <i class="bi-envelope settings-entry-icon"></i>
                        </div>
                        <div class="col">
                            <label asp-for="@settings.EnableEmailSending" class="form-check-label"></label>
                        </div>
                        <div class="col-md-5 text-end">
                            <div class="form-check form-switch form-control-lg">
                                <input type="hidden" name="EnableEmailSending" value="false">
                                <input type="checkbox" name="EnableEmailSending" value="true" class="form-check-input" @(settings.EnableEmailSending ? "checked" : null)>
                            </div>
                        </div>
                    </div>

                    <div class="settings-entry2 row align-items-center py-3 px-2 rounded-3 shadow-sm border bg-white mb-2">
                        <div class="col-auto">
                            <i class="bi-chat-left settings-entry-icon"></i>
                        </div>
                        <div class="col">
                            <label asp-for="@settings.SendEmailOnNewComment" class="form-check-label"></label>
                        </div>
                        <div class="col-md-5 text-end">
                            <div class="form-check form-switch form-control-lg">
                                <input type="hidden" name="SendEmailOnNewComment" value="false">
                                <input type="checkbox" name="SendEmailOnNewComment" value="true" class="form-check-input" @(settings.SendEmailOnNewComment ? "checked" : null)>
                            </div>
                        </div>
                    </div>

                    <div class="settings-entry2 row align-items-center py-3 px-2 rounded-3 shadow-sm border bg-white mb-2">
                        <div class="col-auto">
                            <i class="bi-reply settings-entry-icon"></i>
                        </div>
                        <div class="col">
                            <label asp-for="@settings.SendEmailOnCommentReply" class="form-check-label"></label>
                        </div>
                        <div class="col-md-5 text-end">
                            <div class="form-check form-switch form-control-lg">
                                <input type="hidden" name="SendEmailOnCommentReply" value="false">
                                <input type="checkbox" name="SendEmailOnCommentReply" value="true" class="form-check-input" @(settings.SendEmailOnCommentReply ? "checked" : null)>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="admin-settings-action-container border-top pt-2 mt-2">
        <input id="btn-save-settings" type="submit" value="@SharedLocalizer["Save"]" class="btn btn-outline-accent" />
    </div>
</form>
